<template>
	<view class="material-content">
		<!-- <yk-header :title="title" @headBtn="headBtn()" @closePage="closePage()"></yk-header> -->
		<view class="yk">
			<view @click="toback">
				<image class="left" src="../../static/img/left.png"></image>
			</view>
			<view>
				<view class="title-box">{{title}}</view>
			</view>
			<view class="uni-page-head-right">
				<view class="image-box">
					<image src="../../static/img/zhanye/btn.png"></image>
				</view>
				<view class="image-box-btn">
					<view class="box-btn1" @click="headBtn($event)"></view>
					<view class="box-btn2" @click="closePage($event)"></view>
				</view>

			</view>

			<!-- <view class="right">
				<view class="image-box">
					<image src="../../static/img/zhanye/btn.png" mode="aspectFill"></image>
				</view>
				<view class="image-box-btn">
					<view class="box-btn" @click="headBtn($event)"></view>
					<view class="box-btn" @click="closePage($event)"></view>
				</view>
			</view> -->
		</view>



		<view class="material-head">
			<view class="tab-material">
				<view :class="[pageIndex==1?'active':'']" data-index='1' @click="tabPageindex($event)">海报</view>
				<view :class="[pageIndex==2?'active':'']" data-index='2' @click="tabPageindex($event)">朋友圈助手</view>
				<view :class="[pageIndex==3?'active':'']" data-index='3' @click="tabPageindex($event)">爆文</view>
				<view :class="[pageIndex==4?'active':'']" data-index='4' @click="tabPageindex($event)">视频</view>
				<view :class="[pageIndex==5?'active':'']" data-index='5' @click="tabPageindex($event)">贺卡</view>
			</view>

			<!-- 展业海报tab -->
			<scroll-view :scroll-left="scrollLeft" class="scroll-view" scroll-x="true" v-if='pageIndex==1'>
				<view :class="[posterkindIndex==index?'active':'']" v-for="(kind, index) in posterKind" :key="index" :data-id="kind.id"
				 :data-index="index" @click="tabKindindex($event)">{{kind.name}}</view>
			</scroll-view>


			<!-- 朋友圈助手tab -->
			<scroll-view :scroll-left="scrollLeft" class="scroll-view" scroll-x="true" v-if='pageIndex==2'>
				<view :class="[friendkindIndex==index?'active':'']" v-for="(kind, index) in friendKind" :key="index" :data-id="kind.id"
				 :data-index="index" @click="tabKindindex($event)">{{kind.name}}</view>
			</scroll-view>

			<!-- 爆文tab -->

			<scroll-view :scroll-left="scrollLeft" class="scroll-view" scroll-x="true" v-if='pageIndex==3'>
				<view :class="[articlekindIndex==index?'active':'']" v-for="(kind, index) in explosiveKind" :key="index" :data-id="kind.id"
				 :data-index="index" @click="tabKindindex($event)">{{kind.name}}</view>
			</scroll-view>

			<!--视频tab -->
			<scroll-view :scroll-left="scrollLeft" class="scroll-view" scroll-x="true" v-if='pageIndex==4'>
				<view :class="[videokindIndex==index?'active':'']" v-for="(kind, index) in videoKind" :key="index" :data-id="kind.id"
				 :data-index="index" @click="tabKindindex($event)">{{kind.name}}</view>
			</scroll-view>

			<!-- 贺卡tab -->
			<scroll-view :scroll-left="scrollLeft" class="scroll-view" scroll-x="true" v-if='pageIndex==5'>
				<view :class="[cardkindIndex==index?'active':'']" v-for="(kind, index) in cardKind" :key="index" :data-id="kind.id"
				 :data-index="index" @click="tabKindindex($event)">{{kind.name}}</view>
			</scroll-view>
		</view>

		<!-- 展业海报渲染图片 -->
		<view class="picture-list" v-if='pageIndex==1'>
			<view class="picture-box" v-for="(poster, index) in PosterList" :key="index" :data-id="poster.id" :data-url='poster.picture'
			 @click="goPoster($event)">
				<image :src="poster.picture" mode="widthFix"></image>
				<view>{{poster.title}}</view>
			</view>
		</view>

		<!-- 朋友圈助手渲染数据 -->
		<view class="friends-helper" v-if='pageIndex==2'>
			<view class="friends-msg" v-for="(friend, index) in friendList" :key="index" :data-id="friend.id">
				<view class="msg-head">
					<image src="../../static/img/zhanye/head.png" mode="widthFix"></image>
				</view>
				<view class="msg-content">
					<view class="msg-head-btn">
						<view class="head-msg">
							<view>朋友圈助手</view>
							<view>{{friend.createTime}}</view>
						</view>
						<view v-if="version==1"></view>
						<view class="head-btn" @click="friendShare(friend)" v-else>一键分享</view>
					</view>
					<view v-if='friend.title' class="msg-subject" :data-leth='Math.floor(friend.title.length/18)' :class="[friend.lookALL<2?'active':'']">{{friend.title}}</view>
					<view class="look-all-title" v-if="friend.lookALL>=1" :data-index='index' :data-type='friend.lookALL' @click="lookAlltitle($event)">{{friend.lookALL==1?"全部":"收起"}}</view>
					<view v-if='friend.picture' class="msg-image" @click="getImgLook($event)" :data-url='friend.picture'>
						<image :src="friend.picture" mode="widthFix"></image>
					</view>
				</view>
			</view>
		</view>
		<!-- 爆文数据 -->
		<view class='explosive' v-if='pageIndex==3'>
			<view class="explosive-box" v-for="(article, index) in ArticleList" :key="index" :data-title="article.title"
			 :data-time="article.createTime" :data-url="article.url" :data-id="article.id" @tap="articlexq">
				<view class="explosive-left">
					<view>{{article.title}}</view>
					<view>{{article.createTime}}</view>
				</view>
				<image class="explosive-right" :src='article.url' mode="widthFix"></image>

			</view>
		</view>

		
		<!-- 加载 -->
		<view class="loading-text" v-if="(PosterList.length>10||PosterList.length<1)&&pageIndex==1">{{ loadingText }}</view>
		<view class="loading-text" v-if="(friendList.length>10||friendList.length<1)&&pageIndex==2">{{ loadingText1 }}</view>
		<view class="loading-text" v-if="(ArticleList.length>10||ArticleList.length<1)&&pageIndex==3">{{ loadingText2 }}</view>

		<!-- 视频数据 -->
		<view>
			<view class="videos">
				<view class='video' v-if='pageIndex==4'>
					<view class="video-box">
						<view class="video-list" v-for="(video, index) in VideoList" :key="index" :data-id="video.id" @tap="videoxq">
							<view>
								<view class="video-url">
									<image class="cover" :src="video.urlPic"></image>
									<!-- <video :poster="video.urlPic"   :src="video.url"  @play="playVideo($event)"></video> -->
									<image class="bof" src="../../static/img/bof.png"></image>
								</view>
								<view>{{video.title}}</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 贺卡数据 -->
		<view class="cards-list" v-if='pageIndex==5'>
			<view class="cards-box" v-for="(poster, index) in CardList" :key="index" :data-id="poster.id" @click="cards($event)">
				<image :src="poster.url" mode="widthFix"></image>
				<view>{{poster.title}}</view>
			</view>
		</view>

		<view class="loading-text" v-if="(VideoList.length>10||VideoList.length<1)&&pageIndex==4">{{ loadingText3 }}</view>
		<view class="loading-text" v-if="(CardList.length>10||CardList.length<1)&&pageIndex==5">{{ loadingText4 }}</view>
	</view>
</template>
<script>
	let page = 1,
		limit = 10,
		page1 = 1,
		limit1 = 10,
		pagebw = 1,
		limitbw = 10,
		pagesp = 1,
		limitsp = 10,
		pagehk = 1,
		limithk = 10;
	export default {
		onLoad(event) {
			if (event.pageIndex) {
				this.pageIndex = event.pageIndex;

			}
			if (event.cardkindIndex) {
				this.cardkindIndex = event.cardkindIndex;
				this.categoryIdhk = event.categoryIdhk;
				// console.log(this.categoryIdhk)
			}
			page = 1;
			limit = 10;
			page1 = 1,
				limit1 = 10;
			pagebw = 1,
				limitbw = 10;
			pagesp = 1,
				limitsp = 10;
			pagehk = 1,
				limithk = 10;
			this.PosterList = [];
			this.friendList = [];
			this.ArticleList = [];
			this.VideoList = [];
			this.CardList = [];
			this.loadingText = '加载中...';
			this.loadingText1 = '加载中...';
			this.loadingText2 = '加载中...';
			this.loadingText3 = '加载中...';
			this.loadingText4 = '加载中...';
			this.getFriendsKind();
			this.getPosterKind();
			this.getexplosive();
			this.getvideo();
			this.getcard();
			this.version = window.version;
			// console.log("window.version====" + window.version);
			this.videoContext = uni.createVideoContext('video1');

			let that = this;
			uni.getSystemInfo({
				success: function(res) {
					let width = res.windowWidth;

					that.wCoefficient = width / 8;
					// console.log(that.wCoefficient);
				}
			});

			this.playVideo()

		},
		onShow() {
			
			window.genVersion();
		},
		// 上拉加载下一页数据
		onReachBottom: function() {
			if (this.pageIndex == 1) {
				this.loadingText = '加载中...';
				this.getPosterList();
			} else if (this.pageIndex == 2) {
				this.loadingText1 = '加载中...';
				this.getFriendsList();
			} else if (this.pageIndex == 3) {
				this.loadingText2 = '加载中...';
				this.getArticleList();
			} else if (this.pageIndex == 4) {
				this.loadingText3 = '加载中...';
				this.getVideoList();
			} else if (this.pageIndex == 5) {
				this.loadingText4 = '加载中...';
				this.getCardList();
			}
		},
		// 下拉刷新
		onPullDownRefresh: function() {
			if (this.pageIndex == 1) {
				page = 1;
				limit = 10;
				this.PosterList = [];
				this.loadingText = '加载中...';
				this.getPosterList();
			} else if (this.pageIndex == 2) {
				page1 = 1;
				limit1 = 10;
				this.friendList = [];
				this.loadingText1 = '加载中...';
				this.getFriendsList();
			} else if (this.pageIndex == 3) {
				pagebw = 1;
				limitbw = 10;
				this.ArticleList = [];
				this.loadingText2 = '加载中...';
				this.getArticleList();
			} else if (this.pageIndex == 4) {
				pagesp = 1,
					limitsp = 10;
				this.VideoList = [];
				this.loadingText3 = '加载中...';
				this.getVideoList();
			} else {
				pagehk = 1,
					limithk = 10;
				this.CardList = [];
				this.loadingText4 = '加载中...';
				this.getCardList();
			}


		},
		data() {
			return {
				pageIndex: 1,
				title: '素材',
				posterkindIndex: 0, //点击展业海报name下标 
				friendkindIndex: 0, //点击朋友圈助手name下标
				articlekindIndex: 0, //点击爆文name下标
				videokindIndex: 0, //点击视频name下标
				cardkindIndex: 0, //点击贺卡name下标

				posterKind: [], //展业海报tab
				explosiveKind: [], //爆文tab
				friendKind: [], //朋友圈助手tab
				cardKind: [], //贺卡tab
				videoKind: [], // 视频tab

				categoryId: '',
				categoryId1: '',
				categoryIdbw: '',
				categoryIdsp: '',
				categoryIdhk: '',

				PosterList: [], //展业海报数据
				friendList: [], //朋友圈助手数据
				ArticleList: [], //爆文数据
				VideoList: [], //视频数据
				CardList: [], //贺卡数据
				// videourl:'',  //视频

				// 当前选择的分类
				scrollLeft: '',
				wCoefficient: '',
				version: 0,
			};
		},
		methods: {
			//视频播放后暂停
			playVideo(e) {
				let that = this;
				// this.videoContext.pause();
				setTimeout(function() {
					autoplay: false;
				}, 0.1);
				// let VideoContext=uni.createVideoContext('video1',e);
				// VideoContext.pause()
			},
			lookAlltitle(e) {
				let index = e.currentTarget.dataset.index;
				// console.log(index);
				if (this.friendList[index].lookALL == 1) {
					this.friendList[index].lookALL = 2
				} else {
					this.friendList[index].lookALL = 1
				}
				this.getFriendsList('look');
				// console.log(this.friendList[index].lookALL);
			},
			//顶部功能键
			headBtn(e) {
				console.log(e);
				let that = this;
				uni.showActionSheet({
					itemList: ['刷新', '清除缓存'],
					success: function(res) {
						console.log('选中了第' + (res.tapIndex + 1) + '个按钮');
						if (res.tapIndex == 0) {
							//刷新
							that.pageIndex = 1;
							that.posterkindIndex = 0;
							that.friendkindIndex = 0;
							that.articlekindIndex = 0;
							that.videokindIndex = 0;
							that.cardkindIndex = 0;
							page = 1;
							limit = 10;
							page1 = 1,
							limit1 = 10;
							pagebw = 1,
							limitbw = 10;
							pagesp = 1,
							limitsp = 10;
							pagehk = 1,
							limithk = 10;
							that.PosterList = [];
							that.friendList = [];
							that.ArticleList = [];
							that.VideoList = [];
							that.CardList = [];
							that.loadingText = '加载中...';
							that.loadingText1 = '加载中...';
							that.loadingText2 = '加载中...';
							that.loadingText3 = '加载中...';
							that.loadingText4 = '加载中...';
							that.getFriendsKind();
							that.getPosterKind();
							that.getexplosive();
							that.getvideo();
							that.getcard();
						} else {
							//清楚缓存
							// callNative('onClearH5Cache')
							uni.showToast({
								title: '清除缓存成功'
							});
						}
					},
					fail: function(res) {
						console.log(res.errMsg);
					}
				});
			},
			//关闭当前页面
			closePage() {
				callNative('navigateBack')
			},
			//一键分享
			friendShare(e) {
				onShare('', e.title, e.picture, '');
			},
			//点击图片跳转新放大图片展业海报
			goPoster(e) {
				h5NavigateTo({
					url: 'poster?url=' + e.currentTarget.dataset.url
				});
			},
			//跳转爆文详情
			articlexq(e) {
				// console.log(e)
				let newsid = e.currentTarget.dataset.id;
				h5NavigateTo({
					url: './explosivexq?id=' + newsid
				});
			},
			//跳转视频详情
			videoxq(e) {
				let newsid = e.currentTarget.dataset.id;
				h5NavigateTo({
					url: './videodetails?id=' + newsid
				})
			},
			//跳转贺卡详情
			cards(e) {
				let newsid = e.currentTarget.dataset.id;
				// h5NavigateTo({
				// 	url: './cards?id=' + newsid+'&pageIndex='+this.pageIndex+'&cardkindIndex='+this.cardkindIndex+'&categoryIdhk='+this.categoryIdhk
				// });
				uni.navigateTo({
					url: './cards?id=' + newsid + '&pageIndex=' + this.pageIndex + '&cardkindIndex=' + this.cardkindIndex +
						'&categoryIdhk=' + this.categoryIdhk
				})
			},
			toback(e) {
				uni.navigateTo({
					url: "./developKing"
				});
			},
			//点击放大朋友圈助手图片
			getImgLook(e) {
				let that = this;
				let imgs = [];
				imgs.push(e.currentTarget.dataset.url);
				console.log(imgs);
				//预览图片
				uni.previewImage({
					current: 0,
					urls: imgs,
					longPressActions: {
						itemList: ['发送给朋友', '保存图片', '收藏'],
						success: function(data) {
							console.log('success');
						},
						fail: function(err) {
							console.log(err.errMsg);
						}
					}
				})
			},
			//大标题索引
			tabPageindex(e) {
				this.pageIndex = e.currentTarget.dataset.index;
			},
			//点击小标题tab
			tabKindindex(e) {
				if (this.pageIndex == 1) {
					// 选中的索引
					this.posterkindIndex = e.currentTarget.dataset.index;
					var index = this.posterkindIndex;

					// 具体的分类id
					this.categoryId = e.currentTarget.dataset.id;
					this.posterkindIndex = index;
					// 动态替换内容
					this.content = this.posterKind[index].name;


					if ((index > 2) && index < (this.posterKind.length - 2)) {
						this.scrollLeft = this.wCoefficient * (index - 2);
					} else if (index <= 2) {
						this.scrollLeft = 0;
					} else if (index >= (this.posterKind.length - 2)) {
						this.scrollLeft = this.wCoefficient * (this.posterKind.length)
					}

					// 读取分类数据
					// this.categoryId = this.categoryId; //把分类信息发送给api接口即可读取对应分类的数据


					// 重置分页及数据
					page = 1;
					limit = 10;
					this.PosterList = [];
					this.loadingText = '加载中...';
					this.getPosterList();
				} else if (this.pageIndex == 2) {
					this.friendkindIndex = e.currentTarget.dataset.index;
					var index = this.friendkindIndex;

					// 具体的分类id
					this.categoryId1 = e.currentTarget.dataset.id;
					this.friendkindIndex = index;
					// 动态替换内容
					this.content = this.friendKind[index].name;

					if ((index > 2) && index < (this.friendKind.length - 2)) {
						this.scrollLeft = this.wCoefficient * (index - 2);
					} else if (index <= 2) {
						this.scrollLeft = 0;
					} else if (index >= (this.friendKind.length - 2)) {
						this.scrollLeft = this.wCoefficient * (this.friendKind.length)
					}

					// 读取分类数据
					// this.categoryId = this.categoryId; //把分类信息发送给api接口即可读取对应分类的数据

					page1 = 1;
					limit1 = 10;
					this.friendList = [];
					this.loadingText1 = '加载中...';
					this.getFriendsList();
				} else if (this.pageIndex == 3) {
					this.articlekindIndex = e.currentTarget.dataset.index;
					var index = this.articlekindIndex;

					// 具体的分类id
					this.categoryIdbw = e.currentTarget.dataset.id;
					this.articlekindIndex = index;

					// 动态替换内容
					this.content = this.explosiveKind[index].name;

					if ((index > 2) && index < (this.explosiveKind.length - 2)) {
						this.scrollLeft = this.wCoefficient * (index - 2);
					} else if (index <= 2) {
						this.scrollLeft = 0;
					} else if (index >= (this.explosiveKind.length - 2)) {
						this.scrollLeft = this.wCoefficient * (this.explosiveKind.length)
					}


					pagebw = 1;
					limitbw = 10;
					this.ArticleList = [];
					this.loadingText2 = '加载中...';
					this.getArticleList();
					// type=1;
					// this.getexplosive(1);
				} else if (this.pageIndex == 4) {
					this.videokindIndex = e.currentTarget.dataset.index;
					var index = this.videokindIndex;
					// 具体的分类id
					this.categoryIdsp = e.currentTarget.dataset.id;
					this.videokindIndex = index;

					// 动态替换内容
					this.content = this.videoKind[index].name;

					if ((index > 2) && index < (this.videoKind.length - 2)) {
						this.scrollLeft = this.wCoefficient * (index - 2);
					} else if (index <= 2) {
						this.scrollLeft = 0;
					} else if (index >= (this.videoKind.length - 2)) {
						this.scrollLeft = this.wCoefficient * (this.videoKind.length)
					}

					pagesp = 1;
					limitsp = 10;
					this.VideoList = [];
					this.loadingText3 = '加载中...';
					this.getVideoList();

				} else {
					this.cardkindIndex = e.currentTarget.dataset.index;
					var index = this.cardkindIndex;

					// 具体的分类id
					this.categoryIdhk = e.currentTarget.dataset.id;
					this.cardkindIndex = index;

					// 动态替换内容
					this.content = this.cardKind[index].name;

					if ((index > 2) && index < (this.cardKind.length - 2)) {
						this.scrollLeft = this.wCoefficient * (index - 2);
					} else if (index <= 2) {
						this.scrollLeft = 0;
					} else if (index >= (this.cardKind.length - 2)) {
						this.scrollLeft = this.wCoefficient * (this.cardKind.length)
					}

					pagehk = 1;
					limithk = 10;
					this.CardList = [];
					this.loadingText4 = '加载中...';
					this.getCardList();
				}
			},
			// 朋友圈助手tab接口

			getFriendsKind() {
				try {
					uni.request({
						url: this.$usereq + '/coupon-admin/zy/friendcategory/list',
						method: 'GET',
						header: {
							'blade-auth': decodeURI(uni.getStorageSync('token')),
							'content-type': 'application/json'
						},
						data: {},
						success: res => {
							let datas = res.data;
							console.log(datas);
							if (datas.code == 200) {
								this.friendKind = datas.data;
								this.categoryId1 = datas.data[0].id;
								this.getFriendsList();
							}else if(datas.code == 400){
								this.loadingText='没有更多了'
							}else {
								uni.showToast({
									title: datas.msg,
									icon: 'none',
									duration: 2000
								});
							}
							uni.stopPullDownRefresh();
						}
					});
					if(this.getFriendsList.length==''){
						this.loadingText = '没有更多了';
					}
				} catch (e) {
					console.log(e.message);
				}
			},
			// 展业海报tab接口
			getPosterKind() {
				try {
					uni.request({
						url: this.$usereq + '/coupon-admin/zy/postercategory/list',
						method: 'GET',
						header: {
							'blade-auth': decodeURI(uni.getStorageSync('token')),
							'content-type': 'application/json'
						},
						data: {},
						success: res => {
							let datas = res.data;
							console.log(datas);
							if (datas.code == 200) {
								this.posterKind = datas.data;
								this.categoryId = datas.data[0].id;
								this.getPosterList();
							}else if(datas.code == 400){
								this.loadingText1='没有更多了'
							}else {
								uni.showToast({
									title: datas.msg,
									icon: 'none',
									duration: 2000
								});
							}
							uni.stopPullDownRefresh();
						}
					});
					if(this.getPosterList.length==''){
						this.loadingText1 = '没有更多了';
					}
				} catch (e) {
					console.log(e.message);
				}
			},

			// 爆文tab接口
			getexplosive(type) {
				try {
					uni.request({
						url: this.$usereq + '/coupon-admin/zy/category/list',
						method: 'GET',
						header: {
							'blade-auth': decodeURI(uni.getStorageSync('token')),
							'content-type': 'application/json'
						},
						data: {
							type: 1
						},
						success: res => {
							let datas = res.data;
							console.log(datas);
							if (datas.code == 200) {
								this.explosiveKind = datas.data;
								this.categoryIdbw = datas.data[0].id;
								this.getArticleList(); // 是渲染数据接口
							}else if(datas.code == 400){
								this.loadingText2="没有更多了"
							}else {
								uni.showToast({
									title: datas.msg,
									icon: 'none',
									duration: 2000
								});
							}
							uni.stopPullDownRefresh();
						}
					});
					if(this.getArticleList.length==''){
						this.loadingText2 = '没有更多了';
					}
				} catch (e) {
					console.log(e.message);
				}
			},
			// 视频tab接口
			getvideo(type) {
				try {
					uni.request({
						url: this.$usereq + '/coupon-admin/zy/category/list',
						method: 'GET',
						header: {
							'blade-auth': decodeURI(uni.getStorageSync('token')),
							'content-type': 'application/json'
						},
						data: {
							type: 2
						},
						success: res => {
							let datas = res.data;
							console.log(datas);
							if (datas.code == 200) {
								this.videoKind = datas.data;
								this.categoryIdsp = datas.data[0].id;
								this.getVideoList(); //是渲染数据接口
							}else if(datas.code == 400){
								this.loadingText3="没有更多了"
							}else {
								uni.showToast({
									title: datas.msg,
									icon: 'none',
									duration: 2000
								});
							}
							uni.stopPullDownRefresh();
						}
					});
					if(this.getVideoList.length==''){
						this.loadingText3 = '没有更多了';
					}
				} catch (e) {
					console.log(e.message);
				}
			},
			//贺卡tab
			getcard(type) {
				try {
					uni.request({
						url: this.$usereq + '/coupon-admin/zy/category/list',
						method: 'GET',
						header: {
							'blade-auth': decodeURI(uni.getStorageSync('token')),
							'content-type': 'application/json'
						},
						data: {
							type: 3
						},
						success: res => {
							let datas = res.data;
							console.log(datas);
								if (datas.code == 200) {
								this.cardKind = datas.data;
								// this.categoryIdhk = datas.data[0].id;
								this.getCardList() //是渲染数据接口
								}else if(datas.code ==400){
									this.loadingText4 = '没有更多了';
								}else {
									uni.showToast({
										title: datas.msg,
										icon: 'none',
										duration: 2000
									});
								}
							uni.stopPullDownRefresh();
						}
						 
					});
					if(this.getCardList.length==''){
						this.loadingText4 = '没有更多了';
					}
				} catch (e) {
					console.log(e.message);
				}
			},

			// 朋友圈助手数据接口
			getFriendsList(type) {
				try {
					uni.request({
						url: this.$usereq + '/coupon-admin/zy/friend/list',
						method: 'GET',
						header: {
							'blade-auth': decodeURI(uni.getStorageSync('token')),
							'content-type': 'application/json'
						},
						data: {
							categoryId: this.categoryId1,
							page: page1,
							limit: limit1
						},
						success: res => {
							let datas = res.data;
							console.log(datas);
							if (datas.code == 200) {
								// let PosterList = datas.data;
								let newList = datas.data.list;
								if (newList != '' && newList.length > 0 || newList != []) {
									this.friendList = this.friendList.concat(newList);
									for (let i = 0; i < this.friendList.length; i++) {
										if (this.friendList[i].lookALL != 2) {
											this.friendList[i].lookALL = 0; //不用展开
										}
										let str = this.friendList[i].title;
										if ((str.split('\n').length - 1) + Math.floor(str.length / 18) >= 5) {
											if (this.friendList[i].lookALL != 2) {
												this.friendList[i].lookALL = 1; //展开
											}
										}
									}
									if (type != 'look') {
										page1++;
									}
									// console.log(page1);
									if (newList.length < 10) {
										this.loadingText1 = '没有更多了';
									}
								} else {
									this.loadingText1 = '没有更多了';
								}
								uni.stopPullDownRefresh();
							} else {
								uni.showToast({
									title: datas.msg,
									icon: 'none',
									duration: 2000
								});
							}
							uni.stopPullDownRefresh();
						}
					});
				} catch (e) {
					console.log(e.message);
				}
			},

			// 展业海报数据接口
			getPosterList() {
				try {
					uni.request({
						url: this.$usereq + '/coupon-admin/zy/poster/list',
						method: 'GET',
						header: {
							'blade-auth': decodeURI(uni.getStorageSync('token')),
							'content-type': 'application/json'
						},
						data: {
							categoryId: this.categoryId,
							page: page,
							limit: limit
						},
						success: res => {
							let datas = res.data;
							console.log(datas);
							if (datas.code == 200) {
								// let PosterList = datas.data;
								let newList = datas.data.list;
								if (newList != '' && newList.length > 0 || newList != []) {
									this.PosterList = this.PosterList.concat(newList);
									page++;
									if (newList.length < 10) {
										this.loadingText = '没有更多了';
									}
								} else {
									this.loadingText = '没有更多了';
								}
								uni.stopPullDownRefresh();
							} else {
								uni.showToast({
									title: datas.msg,
									icon: 'none',
									duration: 2000
								});
							}
							uni.stopPullDownRefresh();
						}
					});
				} catch (e) {
					console.log(e.message);
				}
			},

			// 爆文数据接口
			getArticleList() {
				try {
					uni.request({
						url: this.$usereq + '/coupon-admin/zy/article/list',
						method: 'GET',
						header: {
							'blade-auth': decodeURI(uni.getStorageSync('token')),
							'content-type': 'application/json'
						},
						data: {
							categoryId: this.categoryIdbw,
							page: pagebw,
							limit: limitbw
						},
						success: res => {
							let datas = res.data;
							// console.log(datas);
							if (datas.code == 200) {
								let newList = datas.data.list;
								if (newList != '' && newList.length > 0 || newList != []) {
									this.ArticleList = this.ArticleList.concat(newList);
									pagebw++;
									if (newList.length < 10) {
										this.loadingText2 = '没有更多了';
									}
								} else {
									this.loadingText2 = '没有更多了';
								}
								uni.stopPullDownRefresh();
							} else {
								uni.showToast({
									title: datas.msg,
									icon: 'none',
									duration: 2000
								});
							}
							uni.stopPullDownRefresh();
						}
					});
				} catch (e) {
					console.log(e.message);
				}
			},

			// 视频数据接口
			getVideoList() {
				try {
					uni.request({
						url: this.$usereq + '/coupon-admin/zy/video/list',
						method: 'GET',
						header: {
							'blade-auth': decodeURI(uni.getStorageSync('token')),
							'content-type': 'application/json'
						},
						data: {
							categoryId: this.categoryIdsp,
							page: pagesp,
							limit: limitsp
						},
						success: res => {
							let datas = res.data;
							console.log(datas);
							if (datas.code == 200) {
								let newList = datas.data.list;
								if (newList != '' && newList.length > 0 || newList != []) {
									this.VideoList = this.VideoList.concat(newList);
									// console.log(this.VideoList);

									// this.videourl=datas.data.list.url
									// console.log(this.videourl);
									pagesp++;
									if (newList.length < 10) {
										this.loadingText3 = '没有更多了';
									}
								} else {
									this.loadingText3 = '没有更多了';
								}
								uni.stopPullDownRefresh();
							} else {
								uni.showToast({
									title: datas.msg,
									icon: 'none',
									duration: 2000
								});
							}
							uni.stopPullDownRefresh();
						}
					});
				} catch (e) {
					console.log(e.message);
				}
			},

			// 贺卡数据接口
			getCardList() {
				// console.log(this.categoryIdhk)
				try {
					uni.request({
						url: this.$usereq + '/coupon-admin/zy/greetcard/list',
						method: 'GET',
						header: {
							'blade-auth': decodeURI(uni.getStorageSync('token')),
							'content-type': 'application/json'
						},
						data: {
							categoryId: this.categoryIdhk ? this.categoryIdhk : this.cardKind[0].id,
							page: pagehk,
							limit: limithk
						},
						success: res => {
							let datas = res.data;
							console.log(datas);
							if (datas.code == 200) {
								let newList = datas.data.list;
								if (newList != '' && newList.length > 0 || newList != []) {
									this.CardList = this.CardList.concat(newList);
									pagehk++;
									if (newList.length < 10) {
										this.loadingText4 = '没有更多了';
									}
								} else {
									this.loadingText4 = '没有更多了';
								}
								uni.stopPullDownRefresh();
							} else {
								uni.showToast({
									title: datas.msg,
									icon: 'none',
									duration: 2000
								});
							}
							uni.stopPullDownRefresh();
						}
					});
				} catch (e) {
					console.log(e.message);
				}
			}
		}
	};
</script>

<style lang="scss" scoped>
	page {
		background: #fff;
		font-size: 26px;
		padding-bottom: 40px;
	}

	.material-content {
		width: 100%;
		min-width: 750px;


		.material-head {
			background: #fff;
			padding-bottom: 10px;
			box-shadow: 0px 6px 10px 0px #ddd;
			width: 100%;
			min-width: 750px;
			position: fixed;
			top: 135px;
			z-index: 10;
		}

		.tab-material {
			height: 90px;
			width: 100%;
			height: 90px;
			line-height: 90px;
			text-align: center;
			margin: 0 auto;
			font-size: 32px;
			margin-left: 25px;

			view {
				float: left;
				// width: 220px;
				padding-left: 45px;
			}

			view.active {
				color: #0096FF;
			}

			view:nth-child(1) {
				// margin-right: 60px;
				text-align: center;
			}
		}

		.scroll-view {
			height: 70px;
			line-height: 50px;
			white-space: nowrap;
			// margin-left: 18px;

			view {
				display: inline-block;
				font-size: 26px;
				height: 50px;
				margin: 0 20px;
			}

			view.active {
				border-bottom: 1px solid #0096FF;
				color: #0096FF;
			}
		}
	}

	.picture-list {
		overflow: hidden;
		padding: 0 50px;
		padding-top: 310px;

		.picture-box {
			float: left;
			width: 310px;
			height: 534px;
			border-radius: 10px;
			margin-top: 30px;
			position: relative;

			image {
				width: 100%;
				height: 534px;
				border-radius: 8px;
			}

			view {
				padding: 0 20px;
				background: rgba(0, 0, 0, 0.6);
				color: #fff;
				box-sizing: border-box;
				position: absolute;
				bottom: 0;
				width: 100%;
				line-height: 70px;
				border-radius: 0 0 8px 8px;
			}
		}

		view:not(:nth-child(2n)) {
			margin-right: 30px;
		}
	}

	.friends-helper {
		background: #fff;
		padding: 0 30px;
		padding-top: 310px;

		.friends-msg {
			padding: 30px 0 10px 0;
			overflow: hidden;

			.msg-head {
				float: left;
				width: 80px;
				margin-right: 25px;

				image {
					width: 80px;
					height: 80px;
					border-radius: 50%;
				}
			}

			.msg-content {
				width: 585px;
				float: left;

				.msg-head-btn {
					height: 80px;
					overflow: hidden;

					.head-msg {
						float: left;
						max-width: 210px;

						view:nth-child(1) {
							font-size: 34px;
							line-height: 50px;
						}

						view:nth-child(2) {
							color: #999;
							line-height: 30px;
						}
					}

					.head-btn {
						width: 140px;
						height: 54px;
						line-height: 54px;
						margin-top: 13px;
						float: right;
						font-size: 24px;
						border-radius: 54px;
						border: 1px solid #0096FF;
						color: #0096FF;
						text-align: center;
					}
				}

				.msg-subject {
					margin-top: 20px;
					font-size: 32px;
					line-height: 40px;
					-webkit-touch-callout: all;
					-webkit-user-select: all;
					-moz-user-select: all;
					-ms-user-select: all;
					user-select: all;
					white-space: pre-line;
				}

				.msg-subject.active {
					overflow: hidden;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-line-clamp: 5;
					-webkit-box-orient: vertical;
				}

				.look-all-title {
					color: #0096FF;
					margin-top: 20px;
				}

				.msg-image {
					margin-top: 24px;
					width: 200px;

					image {
						width: 200px;
					}
				}
			}
		}
	}

	// 爆文start
	.explosive {
		margin-top: 310px;
		// height:136px;
		// line-height: 136px;
		padding: 0 20px;

		.explosive-box {
			position: relative;
			display: flex;
			justify-content: space-between;
			padding: 28px 0;
			border-bottom: 2px solid #f0f0f0;
			display: flex;

			//    justify-content: center;
			//    align-items: center;
			.explosive-left {
				width: 470px;

				// padding-left: 24px;
				view:nth-child(1) {
					font-size: 28px;
					color: #333333;
					line-height: 48px;
				}

				view:nth-child(2) {
					position: absolute;
					bottom: 6px;
					left: 0px;
					font-size: 24px;
					color: #999999;
					// margin-top: 36px;
					line-height: 56px;
				}
			}

			image {
				border-radius: 4px;
				width: 220px !important;
				height: 124px !important;
			}
		}

	}


	// 爆文end

	// 视频start
	.videos {
		margin-top: 260px;
		padding: 20px 18px;

		.video {
			margin-top: 30px;
			// height:270px;
			width: 100%;

			.video-box {
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				flex-wrap: wrap;

				.video-list {
					.video-url {
						// background: #fff;
						// box-shadow: 0 0 0.3rem #ddd;
						// padding-bottom: 0.2rem;
						position: relative;

						.cover {
							width: 346px;
							height: 194px;
							border-radius: 6px;
						}

						.bof {
							width: 60px;
							height: 60px;
							position: absolute;
							top: 67px;
							left: 143px;
						}

						// view{
						// 	position: absolute;
						// 	top: 0;
						// 	left: 0;
						// 	width: 350px;
						// 	height: 200px;
						// 	z-index: 10000;
						// }
					}
				}

				view {
					width: 350px;
					overflow: hidden;
					white-space: nowrap;
					text-overflow: ellipsis;
					font-size: 26px;
					margin-top: 10px;
				}
			}
		}
	}


	// 视频end


	// 贺卡start
	.cards-list {
		overflow: hidden;
		padding: 10px 60px;

		// padding-top: 180px;
		.cards-box {
			float: left;
			width: 300px;
			height: 534px;
			border-radius: 10px;
			margin-top: 30px;
			position: relative;

			image {
				width: 100%;
				height: 534px;
				border-radius: 8px;
			}

			view {
				padding: 0 20px;
				background: rgba(0, 0, 0, 0.6);
				color: #fff;
				box-sizing: border-box;
				position: absolute;
				bottom: 0;
				width: 100%;
				overflow: hidden;
				white-space: nowrap;
				text-overflow: ellipsis;
				line-height: 70px;
				border-radius: 0 0 8px 8px;
			}
		}

		view:not(:nth-child(2n)) {
			margin-right: 30px;
		}
	}

	//贺卡end

	.loading-text {
		display: flex;
		justify-content: center;
		align-items: center;
		height: 60px;
		margin-top: 20px;
		line-height: 60px;
		color: #979797;
		font-size: 24px;
	}

	.yk {
		position: fixed;
		top: 0;
		width: 91%;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		height: 0.4rem;
		padding: 0.6rem 0.32rem;
		// margin-top: 20px;
		background: white;
		z-index: 8888;

		.left {
			width: 38px;
			height: 38px;
			margin-top: 10px;
		}

		.title-box {
			text-align: center;
			font-size: 32px;
			color: 333;
			height: 60px;
			line-height: 60px;
			padding-left: 130px;
		}

	}

	.image-box {
		width: 174px !important;
		height: 64px !important;
		position: relative;
		top: -px;
		display: flex;
		flex-wrap: wrap;
		// padding-top: 6px;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.image-box-btn {
		padding-top: 20px;
		width: 100%;
		// height: 100%;
		position: absolute;
		top: 46px;
		left: 300px;
		z-index: 10;
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		justify-content: center;


		.box-btn1 {
			width: 15%;
			height: 64px;
			display: flex;
			flex-wrap: wrap;
			position: absolute;
			left: 240px;
			top: -6px;
		}

		.box-btn2 {
			width: 10%;
			height: 64px;
			display: flex;
			flex-wrap: wrap;
			position: absolute;
			left: 330px;
			top: -6px;
		}

		view {
			width: 50%;
			height: 64px;
			display: flex;
			flex-wrap: wrap;
		}
	}
</style>
